/*customer theme for vm-manager*/
@vm-grey: #99a9c0;
@vm-grey-light: #f4f4f4;
@vm-spacing-base: 15px;

@btn-border-radius      : 4px;
@border-color-base      : #dddee1;  // outside
@border-color-split     : #e9eaec;  // inside
@primary-color          : #2d8cf0;
@border-radius-small    : 4px;
@info-color             : #2db7f5;

@border-split: 1px solid @border-color-split;
@border-out: 1px solid @border-color-base;

.vm-panel{
  background-color: white;
  text-align: left;
  border-radius: @btn-border-radius;
  .panel-heading{
    text-align: left;
    width: 100%;
    border-radius: 4px 4px 0 0;
    border-bottom: @border-split;
    padding:@vm-spacing-base;
    font-weight: bold;
  }
  .panel-body{
    padding: @vm-spacing-base;
    font-size: 12px;
  }
}

.vm-card-vertical{
  .card-img{
    position: relative;
    img{
      display: block;
      width: 100%;
        cursor: pointer;
    }
    .control{
      position: absolute;
      bottom: -20px;
      right: 15px;
      display: flex;
      span{
        display: flex;
        justify-content: center;
        margin-left: 10px;
        align-items: center;
        color: white;
        font-size: 18px;
        background-color: @primary-color;
        width: 40px;
        height: 40px;
        border-radius: 50%;
        cursor: pointer;
      }
      span.edit{
        background-color: @info-color;
        a{
          color: white;
        }
      }
      span.delete{
        background-color: @primary-color;
      }
    }
  }
  .card-desc{
    p{
      font-size: 12px;
      margin: 5px 0;
      text-align: justify;
      overflow: hidden;
      text-overflow: ellipsis;
    }
  }
}

.vm-card-horizantal{
  overflow: hidden;
  position: relative;
  display: flex;
  padding: 0;
  .card-img{
    display: flex;
    align-items: center;
    width: 50%;
    img{
      display: block;
      margin: 0;
      width: 100%;
    }
  }
  .card-desc{
    width: 50%;
    p{
      font-size: 12px;
      margin: 5px 0;
      text-align: justify;
    }
  }
}

.vm-image-list{
  .image-list-heading{
    .page{
      span{
        margin-right: 10px;
      }
      span.margin-end{
        margin-right: 20px;
      }
      .input-number{
        width: 40px;
        margin-right: 10px;
      }
    }
    .panel-body{
      margin-top: -@vm-spacing-base;
      &>div{
        margin-top: @vm-spacing-base;
      }
    }
  }
  .total{
    margin-right: 15px;
  }
}

